@charset "UTF-8";
/**
 * @ClassName: index.css
 * @Description: 首页样式表
 * @Author: zww
 * @Date: 2017-6-19
 */

/*框架结构*/
html,body{height:100%;zoom:1;}
.body{background: url(../img/bg.jpg) no-repeat;background-size: 100% 100%;}
.sys-name{height: 70px;/*line-height: 70px;*/background: url(../img/logo.png) no-repeat;background-size: 100% 100%;}
.main{height: 100%;width: 100%;}

/*左侧区域*/
.charts-left{float:left;width: 25%;height:100%;}

/*生产线布局图*/
.charts-left .left-top{position:relative;width: 100%;height:60%;background: url(../img/chartBg.png) no-repeat;background-size: 100% 100%;}
.device-title{position:absolute;top:30px;width: 100%;font-size:18px;color: #fff;text-align: center;}
.left-top .device-show{width: 100%;height:100%;background: url(../img/device.png) no-repeat;background-size: 100% 100%;}
.left-top .device-show .equip1{position: absolute;width: 7.4%;height:28.3%;top:19.5%;left:64.3%;cursor:pointer;background: #CB2ADE;opacity: .4;}
.left-top .device-show .equip2{position: absolute;width: 3.13%;height:20.38%;top:17.47%;right:11.04%;cursor:pointer;background: #CB2ADE;opacity: .4;}
.left-top .device-show .equip3{position: absolute;width: 7.29%;height:9.42%;top:41.44%;right:11.04%;cursor:pointer;background: #CB2ADE;opacity: .4;}
.left-top .device-show .equip4{position: absolute;width: 13.5%;height: 5.5%;top: 54.8%;left: 18.86%;cursor:pointer;background: #2BBB3A;opacity: .6;}
.left-top .device-show .equip5{position: absolute;width: 4%;height: 10.2%;top: 35.94%;left: 35.54%;cursor:pointer;background: #2BBB3A;opacity: .6;}
/*生产线布局图弹出框*/
.left-top .modal{position: absolute;width: 94%;height: 86%;bottom: 3%;right: 3%;/*display: none;*/background: #0D3256;}
.left-top .modal .close{position: absolute;width: 30px;height: 30px;top: 0;right: 0;cursor: pointer;background: url(../img/close.png) no-repeat center;}
.left-top .modal .close:hover{background: url(../img/close_hover.png) no-repeat center;}
.left-top .modal .equip-main{width: 100%;height: 100%;background: url(../img/chartBg.png) no-repeat;background-size: 100% 100%;}
.equip-info{padding: 10px 20px 10px;height:90px;font-size: 14px;color: #fff;}
.equip-info p{height: 30px;line-height: 30px;font-size: 18px;color: #00E4CD;}
.pieDiv{width: 100%;}
.infoDiv{/*display: none*/;position: relative;margin: 10px auto;height: 68%;width: 90%;border-right:3px solid #B4A73D;border-radius:10px;overflow: hidden;}
.info-item{position:absolute;top:0;width: 64%;cursor: pointer;}
.infoDiv .item1{background: #0C3B64; z-index: 0; left: 0px;border:3px solid #833EBE;border-radius:10px 0 0 10px;}
.infoDiv .item2{background: #0C3B64; z-index: 1; left: 64%;border:3px solid #1F72CB;border-radius:10px 0 0 10px;}
.infoDiv .item2.move{left: 12%;}
.infoDiv .item3{background: #0C3B64; z-index: 2; left: 76%;border:3px solid #47CAB0;border-radius:10px 0 0 10px;}
.infoDiv .item3.move{left: 24%;}
.infoDiv .item4{background: #0C3B64; z-index: 3; left: 88%;border:3px solid #B4A73D;border-radius:10px 0 0 10px;}
.infoDiv .item4.move{left: 36%;}
.info-item .sb-title{padding: 25px 5%;float: left;width: 10%;line-height: 25px;font-size:20px;font-weight: 600;}
.item1 .sb-title{color: #833EBE;}
.item2 .sb-title{color: #1F72CB;}
.item3 .sb-title{color: #47CAB0;}
.item4 .sb-title{color: #B4A73D;}
.info-item .sb-info{padding: 20px 0;width: 80%;float: left;color: #fff;font-size: 14px;line-height: 30px;}
#pie-charts1,#pie-charts2{float: left;}
/*产量统计*/
.boxBg{width: 96%;height:96%;}
.left-bottom{position: relative;width: 100%;height:40%;background: url(../img/chartBg.png) no-repeat;background-size: 100% 100%;}
.item-tips{position: absolute; top: 20px;left: 8%;width: 84%;height:30px;line-height: 30px;z-index:5;font-size: 16px;color: #C6CED0;}
.item-tips span{float: left;display:inline-block;width: 155px;text-align:center;cursor:pointer;background: url(../img/unselect.png) no-repeat;}
.item-tips span:nth-child(2){float: right;}
.item-tips span.active,.item-tips span:hover{color: #9FEFFF;background: url(../img/select.png) no-repeat;}
#bar-charts1,#bar-charts2,#line-charts{margin: auto;height: 100%;width: 98%;}

/*中间区域*/
.charts-center{float:left;width: 50%;height:100%;}
.center-top{width: 100%;height:60%;background: url(../img/mapBg.png) no-repeat;background-size: 100% 100%;}
#map-charts{height: 100%;width: 100%;}
.center-bottom{width: 100%;height:40%;background: url(../img/lineBg.png) no-repeat;background-size: 100% 100%;}

/*右侧区域*/
.charts-right{float:left;width: 25%;height:100%;}
/*三维立体图展示区*/
.charts-right .right-top{position:relative;width: 100%;height:60%;overflow: hidden;background: url(../img/chartBg.png) no-repeat;background-size: 100% 100%;}
.charts-right .right-top video{object-fit: fill;}
.charts-right .right-top .fl-show{margin: 15% auto 2%;width: 85%;height: 48%;background: url(../img/box.png) no-repeat;background-size: 100% 100%;}
.charts-right .right-top .video1{width: 90%;height: 90%;margin: 6% 6% 0;}
.charts-right .right-top .video2{float:left;width: 42.5%;height:30%;margin: 2% 0 3% 7%;}
.charts-right .right-top .video3{float:left;width: 42.5%;height:30%;margin: 2% 7% 3% 0;}
/*车间产量统计图*/
.charts-right .right-bottom{position: relative;width: 100%;height:40%;background: url(../img/chartBg.png) no-repeat;background-size: 100% 100%;}
.charts-right .right-center .item-video{float:left;width: 50%;height:80%;margin: 4% 0;}
/*视频时间*/
.curDate{position: absolute;/*width: 39%;padding-left: 13px;*/font-size: 16px;color: #fff;background: #000;opacity: .8;/*margin-left: 8%;*/margin-top: 2%;}